<template>
  <div class="content">
    <ul class="msg-list" v-for="(item,key) of dataList" :key='key'>
      <li class="msg-item" @click="$router.push({path:'/msg/detail',query:{id:item.id}})">
        <div class="item-img">
          <img :src="item.picture" alt="" v-if='item.picture'>
          <img src="../../assets/img/nin-live.png" alt="" v-else>
        </div>
        <div class="item-right">
          <h3>{{item.title}}</h3>
          <div class="item-desc">{{item.context}}</div>
          <span>{{item.date}}</span>
        </div>
      </li>
    </ul>
    <div v-infinite-scroll="getData" infinite-scroll-disabled="loading" infinite-scroll-distance="10"></div>
    <zx-no-data v-model='showNoDataBool'></zx-no-data>
  </div>
</template>
<script>
  import { Form, Func, Auth } from '@/providers';
  import { Msg } from '@/services';

  export default {
    data() {
      return {
        dataList: [],
        curPage: '1',
        loading: false,
        showNoDataBool: false
      };
    },
    methods: {
      async getData() {
        if (this.loading) { return false; };
        this.loading = true;
        try {
          let res = await await Msg.GetNoticeByType({
            type: '0', // 0获取所有
            pageItem: 10,
            curPage: this.curPage,
            resultType: '1' // 返回类型 1去除html标签 0不去除html标签
          });
          if (res.data.notices.length >= 10) {
            this.loading = false;
          }
          this.curPage += 1;
          this.dataList = [...this.dataList, ...res.data.notices];
          this.showNoDataBool = res.data.total == 0 ? true : false;
        } catch (error) {
          console.log(error);
        }
      }
    },
    created() {
      this.getData();
    }
  };
</script>
<style lang="scss" scoped>
  @import "../../assets/sass/msg.scss";
</style>